<template>
  <view class="container"> <!-- @click="goToOtherPage"> -->
    <view class="competition-item" v-for="(item, index) in competitions" :key="index">
      <navigator :url="'/pages/enter/select?name=' + item.name+'&groupNumber='+item.groupNumber" open-type="navigate">
      <view class="title">{{ item.name }}</view>
      <!-- <view class="description">{{ item.description }}</view> -->
      <view class="info">
        <text>开始日期: {{ format_date(new Date(item.startDate)) }}</text>
        <text>结束日期: {{ format_date(new Date(item.endDate)) }}</text>
      </view>
      <view class="info">
        <text>地点: {{ item.location }}</text>
       </view>
      <view class="info">
        <text>主办方: {{ item.sponsor }}</text>
      </view>
      <view class="info">
        <text>创建时间: {{ format_date (new Date(item.createTime)) }}</text>
         <text>队伍人数要求: {{ item.groupNumber }}</text>
      </view>
      <!-- <view class="info">
        <text>队伍人数要求: {{ item.groupNumber }}</text>
      </view> -->
      </navigator>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      competitions: [] // 用于存储从API获取的比赛数据
    }
  },
  methods: {
    goToOtherPage() {
      const data = {
          racename: ''//this.competitions[this.index].name,
      };
      console.log(data.racename);
      console.log(this.competitions);
      console.log(this.index);
      uni.navigateTo({
            url: `/pages/enter/select?name=${data.racename}`
          });
        },
    
    // 获取比赛信息
    fetchCompetitions() {
      // const url = 'https://api.yhjoj.cn/app/competition/list?page=1&pageSize=5&name=';
      // const url = 'http://192.168.43.252:8080/app/competition/list?page=1&pageSize=5&name=';
      const url = 'https://icpc.zut.edu.cn/app/competition/list?page=1&pageSize=5&name=';
      uni.request({
        url: url,
        method: 'GET',
       
        success: (res) => {
           console.log(res);
          if (res.statusCode === 200) {
            console.log(res.data.data);
            console.log(res.data.data.records);
            console.log("!!!!!!")
            this.competitions = res.data.data.records; // 假设后端返回的数据直接在data字段中
          } else {
            console.error('Failed to fetch competitions:', res);
          }
        },
        fail: (err) => {
          console.error('Request failed:', err);
        }
      });
    },
      format_date(date) {
       // 自定义日期时间格式
       let year = date.getFullYear();
       let month = (date.getMonth() + 1).toString().padStart(2, '0'); // 月份是从0开始的
       let day = date.getDate().toString().padStart(2, '0');
       
       console.log(year);
       // 可以根据需要添加小时、分钟、秒等
       // const hours = date.getHours().toString().padStart(2, '0');
       // const minutes = date.getMinutes().toString().padStart(2, '0');
       // const seconds = date.getSeconds().toString().padStart(2, '0');
       let ans = `${year}-${month}-${day}`;
       return ans;  // 格式为YYYY-MM-DD
       // 如果需要包含时间，可以这样返回 `\${year}-\${month}-\${day} \${hours}:\${minutes}:\${seconds}`;
     },
     
     LoginOrNot(){
       if (!uni.getStorageSync("hasLogin")) {
       	this.$u.toast('请先登录哦');
         setTimeout(() =>{
           uni.redirectTo({
               url: '/pages/login/weixin'
           });
         },500)  
       }
     }
  },
  mounted() {
    // 页面加载完成后获取数据
    this.fetchCompetitions();
    this.LoginOrNot();
   
  }
}
</script>

<style>
.container {
  padding: 10px;
}
.competition-item {
  border-bottom: 1px solid #eee;
  padding: 10px;
}
.title {
  font-size: 18px;
  font-weight: bold;
}
.description {
  color: #666;
  margin: 5px 0;
}
.info {
  display: flex;
  justify-content: space-between;
  margin-top: 5px;
}
</style>